<template>
  <div class="c_right">
    <ul class="m-0 p-0">
      <li class="flex flex-column">
        <b>金融服务</b>
        <span>煤炭订单融资业务</span>
        <div>
          <img src="../../../assets/img/tc6.png" alt />
        </div>
      </li>
      <li class="flex flex-column">
        <b>金融服务</b>
        <span>煤炭订单融资业务</span>
        <div>
          <img src="../../../assets/img/tc4.png" alt />
        </div>
      </li>
      <li class="flex flex-column">
        <b>金融服务</b>
        <span>煤炭订单融资业务</span>
        <div style="margin-left: 35px;">
          <img src="../../../assets/img/tc5.png" alt />
        </div>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "",
  data() {
    return {};
  },
};
</script>

<style lang="stylus" scoped>
.c_right {
  width: 860px;
  height: 330px;
  margin-right: 34px;
}

ul {
  li {
    list-style: none;
    width: 260px;
    height: 330px;
    float: left;
  }

  li:nth-child(1) {
    background: url('../../../assets/img/tc1.png') no-repeat;
    padding-left: 34px;

    b {
      font-size: 34px;
      font-weight: bold;
      color: #FFFFFF;
      line-height: 96px;
    }

    span {
      font-size: 22px;
      font-weight: 500;
      color: #FFFFFF;
      line-height: 96px;
    }
  }

  li:nth-child(2) {
    background: url('../../../assets/img/tc2.png') no-repeat;
    padding-left: 35px;

    b {
      font-size: 34px;
      font-weight: bold;
      color: #FFFFFF;
      line-height: 96px;
    }

    span {
      font-size: 22px;
      font-weight: 500;
      color: #FFFFFF;
      line-height: 96px;
    }
  }

  li:nth-child(3) {
    background: url('../../../assets/img/tc3.png') no-repeat;

    b {
      font-size: 34px;
      font-weight: bold;
      color: #FFFFFF;
      line-height: 96px;
      display: block;
      margin-left: 35px;
    }

    span {
      font-size: 22px;
      font-weight: 500;
      color: #FFFFFF;
      line-height: 96px;
      display: block;
      margin-left: 35px;
    }
  }
}
</style>